<!--
@license
Copyright (c) 2016 The Polymer Project Authors. All rights reserved.
This code may only be used under the BSD style license found at http://polymer.github.io/LICENSE.txt
The complete set of authors may be found at http://polymer.github.io/AUTHORS.txt
The complete set of contributors may be found at http://polymer.github.io/CONTRIBUTORS.txt
Code distributed by Google as part of the polymer project is also
subject to an additional IP rights grant found at http://polymer.github.io/PATENTS.txt
-->

<!doctype html>
<html lang="en">

<head>
    <meta charset="utf-8">
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">  
    <base href="/templategoods2.pl/">
    <meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=no">
    <title>正在加载..</title>

    <link rel="shortcut icon" sizes="32x32" href="images/shop-icon-32.png">

    <meta name="theme-color" content="#fff">
    <link rel="manifest" href="manifest.json">

    <style>
        body {
            margin: 0;
            padding: 0;
            font-family: 'Roboto', 'Noto', sans-serif;
            font-size: 13px;
            line-height: 1.5;
            min-height: 100vh;
        }

        /* styling for render while resources are loading */

        shop-app[unresolved] {
            display: block;
            min-height: 101vh;
            line-height: 68px;
            text-align: center;
            font-size: 16px;
            font-weight: 600;
            letter-spacing: 0.3em;
            color: #202020;
            padding: 0 16px;
            overflow: visible;
        }
        
        .loading {
            width: 10px;
            height: 10px;
            margin: 0 auto;
            padding: 10px;
            border: 0.3em dashed #fff;
            border-radius: 100%
        }
        .loading {
            animation: loadingkeyframes 1.5s .3s cubic-bezier(.17, .37, .43, .67) infinite
        }

        @keyframes loadingkeyframes {
            0 {
                transform: rotate(0deg)
            }
            50% {
                transform: rotate(180deg)
            }
            100% {
                transform: rotate(360deg)
            }
        }

        #flush {
            display: flex;
            justify-content: center;
            align-items: center;
            width: 100%;
            background-color: rgba(0, 0, 0, 0.25);
            position: fixed;
            z-index: 999999;
            overflow: hidden;
            top: 0px;
            color: #fff;
            max-height: 65px;
        }

        #flush .loading {
            display: none;
        }

    </style>
    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.3.2.js"></script>
    <script src="bower_components/webcomponentsjs/webcomponents-loader.js"></script>
    <link rel="import" async href="src/shop-app.html">
    <script>
        window.Polymer = {rootPath: '/templategoods2.pl/'};
        window.addEventListener('load',e=>{
            window.Polymer.pageWidth = document.body.offsetWidth;
            document.body.addEventListener('focusout',e=>{
                document.body.scrollTop = document.body.scrollTop;
            });
        });
        let scrollEnded = false;
        window.addEventListener("scroll", function() {
            let scrollTop = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;
            let windowHeight = document.documentElement.clientHeight||document.body.clientHeight;
            let scrollHeight = document.body.scrollHeight||document.documentElement.scrollHeight;
            let margin = scrollHeight-(scrollTop + windowHeight);
            if(margin<=1&&!scrollEnded) {
                scrollEnded = true;
                window.dispatchEvent(new CustomEvent("scrollEnded",{detail:{scrollTop:scrollTop,windowHeight:windowHeight,scrollHeight:scrollHeight}}));
                window.setTimeout(function(){scrollEnded=false},1000);
            }
        });
    </script>
</head>

<body>
    <div id="flush">
        <div class="loading"></div>
    </div>
    <shop-app unresolved>
        <div>
            <p style="font-size: 12px;display: flex;justify-content: center;">正在初始化应用，请耐心等候</p>
            <div class="loading" style="border-color: #000;"></div>
        </div>
    </shop-app>
    <script>
/*
        window.performance && performance.mark && performance.mark('index.html');
*/

    </script>

</body>

</html>
